<template>
	<view class="columnbox content wdh-100" v-if="userinfo">
		<image src="/static/img/wenzhenpay.png" mode="aspectFill" class="top-img"></image>
		<view class="info-box columnbox">
			<view class="info-title">医生本人服务·未接诊可退</view>
			<view class="rowbox d-box als">
				<image :src="doctor.logo" mode="aspectFill" class="d-img"></image>
				<view class="columnbox als" style="margin-left: 20rpx;">
					<view class="rowbox d-name">{{doctor.name}} <text>{{doctor.zhicheng}} | {{doctor.keshi}}</text>
					</view>
					<view class="d-jigou">{{doctor.jigou}}</view>
				</view>
			</view>
			<view class="columnbox d-box">
				<view class="u-title">就诊患者</view>
				<view v-if="!userinfo.name||userinfo.name==''" class="add-box" @click="editUserInfo">
					+添加就诊患者
				</view>
				<view class="rowbox u-box" v-if="userinfo!=''">
					<image :src="userinfo.logo" mode="aspectFill" class="u-img"></image>
					<view class="columnbox als" style="margin-left: 20rpx;">
						<view class="u-name">{{userinfo.name}}</view>
						<view class="rowbox u-desc">
							<view v-if="userinfo.sex==2">女</view>
							<view v-else>男</view>
							<view>{{getAge(userinfo.shengri)}}岁</view>
							<text>{{userinfo.cardid.slice(0,4)}}</text>
							**********
							<text>{{userinfo.cardid.slice(userinfo.cardid.length-5,userinfo.cardid.length-1)}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="wdh-100" style="height: 200rpx;"></view>
		<view class="rowbox bottom-box wdh-100">
			<view class="send-btn wdh-100 rowbox" @click="toPay">下一步</view>
		</view>
	</view>
</template>

<script>
	import getDate from '@/utils/time.js'
	export default {
		data() {
			return {
				id: 0,
				doctor: '',
				userinfo: ''
			};
		},
		onLoad(options) {
			this.id = options.id * 1
			this.getDetail()
		},
		onShow() {
			this.getUser()
		},
		methods: {
			toPay() {
				uni.redirectTo({
					url: '/pages/doctor/confirmChatPay?id=' + this.id
				})
			},
			getAge(v) {
				return getDate.getAge(v)
			},
			editUserInfo() {
				uni.navigateTo({
					url: '/pages/editinfo/editinfo'
				})
			},
			getUser() {
				this.$req.post('/user/userinfo', {
					memberid: uni.getStorageSync('memberid')
				}).then(res => {
					this.userinfo = res.data.data
				})
			},
			getDetail() {
				let data = {
					id: this.id
				}
				if (uni.getStorageSync('uid')) {
					data.uid = uni.getStorageSync('uid')
				}
				this.$req.post('/user/doctorinfo', data).then(res => {
					this.doctor = res.data.data.doctor
					// this.doctorsljb = res.data.data.doctorsljb
					// this.ifgz = res.data.data.ifgz
					// res.data.data.pinlun.forEach(resp => {
					//     resp.addtime = getdate.couponDate(resp.addtime)
					// })
					// this.pinlun = res.data.data.pinlun
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		font-family: PingFang SC;
		background: #F5F8FB;
		min-height: 100vh;
		justify-content: flex-start;
	}

	.top-img {
		width: 100%;
		height: 400rpx;
	}

	.info-box {
		width: 100%;
		// background: linear-gradient(to bottom, #a3deb2, #F5F8FB);
		background: #F5F8FB;
		border-radius: 20rpx;
		padding: 32rpx 32rpx;
		border-radius: 20rpx;
		margin-top: -20rpx;
		z-index: 2;
	}

	.info-title {
		font-size: 28rpx;
		width: 100%;
		color: #1c5f2d;
	}

	.d-box {
		width: 100%;
		margin-top: 20rpx;
		background: #fff;
		border-radius: 20rpx;
		padding: 32rpx 32rpx;
		justify-content: flex-start;
	}

	.d-img {
		border-radius: 100rpx;
		width: 100rpx;
		height: 100rpx;
	}

	.d-name {
		font-size: 32rpx;

		text {
			font-size: 28rpx;
			margin-left: 20rpx;
			color: #707070;
		}
	}

	.d-jigou {
		font-size: 28rpx;
		color: #707070;
		margin-top: 10rpx;
		width: 500rpx;
	}

	.u-title {
		font-size: 32rpx;
		width: 100%;
	}

	.add-box {
		width: 100%;
		background: #f9fafc;
		border-radius: 20rpx;
		margin-top: 20rpx;
		font-size: 28rpx;
		padding: 32rpx 32rpx;
	}

	.u-box {
		width: 100%;
		border-radius: 20rpx;
		margin-top: 20rpx;
		padding: 20rpx 20rpx;
		background: rgba(#a3deb2, 0.1);
		border: #a3deb2 solid 1px;
		justify-content: flex-start;
	}

	.u-img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 100rpx;
	}

	.u-name {
		font-size: 32rpx;
	}

	.u-desc {
		font-size: 28rpx;
		margin-top: 10rpx;
		color: #707070;

		view {
			margin-right: 20rpx;
		}
	}
</style>